<template>
  <div class="hello">
    <my-header></my-header>
    <my-line></my-line>
    <my-swiper></my-swiper>
    <!-- <router-link :to="{ name: 'temp'}">Go to Bar</router-link> -->
    <!-- <router-view></router-view> -->
    <my-footer></my-footer>
  </div>
</template>

<script>
import Header from './Header.vue';
import Line from './Line.vue';
import Swiper from './Swiper.vue';
import Footer from './Footer';

export default {
  name: 'HelloWorld',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  },
  components: {
    myHeader: Header,
    myLine: Line,
    mySwiper: Swiper,
    myFooter: Footer
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
